import React, { Component, PropTypes } from 'react';
import { connect } from 'react-redux';
import action from '../Action/Index';
import Search from '../Components/HomePage/Search/Index';
import Slider from '../Components/HomePage/Slider/Index';
import Hot from '../Components/HomePage/Hot/Index';
import Group from '../Components/HomePage/Group';
import News from '../Components/HomePage/News/Index';

class HomePage extends Component {
    constructor(props) {
        super(props)
        this.initState = (props) => {
            let {dispatch, selectedTab, limit} = props;
            dispatch(action.fetchSlider());
            dispatch(action.fetchHot());
            dispatch(action.fetchGroup());
            dispatch(action.fetchNews(selectedTab, 0, limit));
        }
        this.initState(this.props);
    }

    componentWillMount() {

    }

    componentWillReceiveProps(newProps) {
        const {ret, msg, selectedTab, limit, totals, sliderload, newsload, sliderisFetching, isFetching, dispatch} = newProps;
        // dispatch(action.fetchSlider());
        if (!isFetching && newsload.length === 0) {
            dispatch(action.fetchNews(selectedTab, 0, limit));
        }
        if (!isFetching && sliderload.length === 0) {

            dispatch(action.fetchSlider());
        }
    }

    render() {
        let {dispatch, sliderret, slidermsg, slidertotals, sliderload, sliderisFetching, hotload, groupload, group, unreadGroupCount, selectedTab, limit, newsload, newstotals, isFetching, scrollT} = this.props;

        return (
            <div>
                <Search></Search>
                <div className="mui-content content">
                    <Slider list={sliderload} />
                    <Hot list={hotload} />
                    <Group list1={groupload} list2={group} unreadGroupCount={unreadGroupCount} dispatch={dispatch} group={group} />
                    <News {...this.props} />
                </div>
            </div>
        )
    }


    componentDidMount() {
        const {dispatch} = this.props;

        dispatch(action.fetchSlider());
    }

    componentDidUpdate() {
        // dispatch(action.fetchSlider());
    }
    componentWillUnmount() {

    }
}



// 组件验证
HomePage.propTypes = {
    //   sliderload: PropTypes.object.isRequired
}

function mapStateToProps(state) {
    var group = {};
    const {HomePage} = state;
    const {sliderret, slidermsg, slidertotals, sliderisFetching, sliderload, hotload, groupload, classify, groupitemload, selectedTab, limit, newstotals, newsload, isFetching, scrollT} = HomePage;
    // const {sliderload} = HomePage[sliderload] || { sliderload: [] };
    const unreadGroupCount = groupload.length;
    group.classify = classify;
    group.groupitemload = groupitemload;
    // const isFetching = isFetching || { isFetching: false }
    return { sliderret, slidermsg, slidertotals, sliderload, sliderisFetching, hotload, groupload, group, unreadGroupCount, selectedTab, limit, newstotals, newsload, isFetching, scrollT }
}
export default connect(mapStateToProps)(HomePage);